<template>
	<view>
		<wrapBgImg />

		<navigationBar navigationTitle="会员实名认证" />

		<view class="wrap safe-area flex column align-center">
			<view class="wrap-white-bg">
				<block v-for="(item, index) in list" :key="index">
					<block v-if="item.type === 'ocr' && item.direct === 'row'">
						<rowOCR :item="item" v-model="dataInfo[item.key]" @ocrData="onOcrData" />
					</block>

					<block v-else-if="item.type === 'input' && item.direct === 'row'">
						<rowInput :item="item" v-model="dataInfo[item.key]" />
					</block>

					<block v-else-if="item.type === 'choose' && item.direct === 'row'">
						<rowChoose :item="item" v-model="dataInfo[item.key]" />
					</block>
				</block>
			</view>

			<view class="sure-btn theme-gradient-btn f-34" @click="onSubmit">提交</view>
		</view>
	</view>
</template>

<script>
	import { realNameAuthen } from "@/API/mine.js";
	import wrapBgImg from "@/components/navigationBar/bgImg.vue";
	import navigationBar from "@/components/navigationBar/navigationBar.vue";
	import rowInput from "@/components/form/rowInput.vue";
	import rowChoose from "@/components/form/rowChoose.vue";
	import rowOCR from "@/components/form/rowOCR.vue";
	export default {
		components: {
			wrapBgImg,
			navigationBar,
			rowInput,
			rowChoose,
			rowOCR,
		},
		data() {
			return {
				list: [
					{
						title: "身份证",
						require: true,
						type: "ocr",
						key: "id_card",
						mode: "idcard",
						maxlength: 18,
						direct: "row",
						place: "请点击图标识别身份信息",
						tips: "请填写/识别身份信息",
					},
					{
						title: "姓名",
						require: true,
						type: "input",
						key: "real_name",
						place: "请识别",
						mode: "text",
						maxlength: 100,
						direct: "row",
						tips: "请输入姓名",
					},
					{
						title: "出生日期",
						require: true,
						type: "choose",
						key: "birthday",
						mode: "date",
						place: "请识别",
						direct: "row",
						list: [],
						tips: "请选择出生日期",
					},
					{
						title: "性别",
						require: true,
						type: "choose",
						key: "gender",
						mode: "selector",
						direct: "row",
						place: "请识别",
						list: ["男", "女"],
						tips: "请选择性别",
					},
					{
						title: "户籍",
						require: true,
						type: "input",
						key: "household",
						place: "请识别",
						mode: "text",
						maxlength: 100,
						direct: "row",
						tips: "请输入户籍",
					},
				],
				dataInfo: {
					real_name: "",
					id_card: "",
					birthday: "",
					household: "",
					gender: "",
				},
			};
		},
		onLoad(options) {},
		methods: {
			/**
			 * ocr识别
			 */
			onOcrData(res) {
				this.dataInfo.real_name = res.Name;
				this.dataInfo.id_card = res.IDNumber;
				this.dataInfo.birthday = res.BirthDate;
				this.dataInfo.gender = res.Gender;
				this.dataInfo.household = res.Address;
			},
			/**
			 * 提交
			 */
			onSubmit() {
				if (this.$filters.judgeFormList(this.list, this.dataInfo)) {
					let obj = { ...this.dataInfo };
					obj.gender = obj.gender === "男" ? 1 : 0;
					
					this.$throttle(() => {
						realNameAuthen(obj).then((res) => {
							this.$st.success("提交成功", () => {
								uni.navigateBack();
							});
						})
					})
				}
			},
		},
	};
</script>

<style>
	@import "@/css/publish.css";
</style>
